<template>
	<view>
		<!-- <popup2></popup2> -->

		<div class="fxbj">
			<div class="xjsy">
				<div class="rwmbox">
					<div class="rwmtitle">
						<h2>分享</h2>
					</div>
					<div class="zsfx">
						<div class="zsfx_tit">
							<h2>专属的二维码分享</h2>
							<p>分享不断 收入不断</p>
						</div>
						<div class="zsfxnr">
							<image mode="scaleToFill" class="uni-img-tag" :src="info.inviteImg"></image>
						</div>
						<div class="zsfx_text">
							<p id="nr">邀请码:{{info.inviteCode}}</p>
							<ul class="code-btns">
								<!-- #ifdef H5 -->
								<li><a href="javascript:;" class="btn" @click="copy" id="copyBtn">复制邀请码 </a></li>
								<!-- #endif -->
								<!-- #ifdef MP-WEIXIN -->
								<li>
									<button open-type="share" class="btn">分享给朋友</button>
								</li>
								<!-- #endif -->


								<!-- <li><a href="javascript:">生成长图</a></li> -->

							</ul>
						</div>
					</div>
				</div>
			</div>
		</div>
	</view>
</template>

<script>
	import user from "@/common/user.js"
	export default {
		data() {
			return {
				info: {},
			}
		},
		onLoad() {
			user.getMemberInvite(info => {
				console.log(info)
				this.info = info;
			})
		},
		onShareAppMessage() {
			return {
				title: '欢迎使用易启付',
				path: `/pages/login/register?id=${this.info.inviteCode}`
			}
		},
		methods: {
			copy() {
				uni.setClipboardData({
					data: this.info.url ? this.info.url : this.info.inviteCode,
					success: function() {
						uni.showToast({
							icon: "success",
							title: '复制成功'
						})
					}
				});
			}
		}
	}
</script>

<style lang="scss">
	page {
		background-color: #4b92f4;
	}

	.code-btns {
		display: flex;
		flex-direction: row;
		align-items: center;
		justify-content: center;
		.btn{
			width: 300rpx;
			height: 90rpx;
			border-radius: 90rpx;
			color: #ffffff;
			background-color: #4b92f4;
		}
	}

	.zsfxnr {
		display: flex;
		align-items: center;
		justify-content: center;

		.uni-img-tag {
			margin: 0;
			width: 390rpx;
			height: 390rpx;
		}
	}
</style>
